<template>
	<u-tabbar :model-value="current" :list="list" height="106rpx" active-color="#3C51F2" inactive-color="#999999" @change="handleChange"></u-tabbar>
</template>

<script setup lang="ts">
	import { ref } from "vue";

	import type { bottomTabbar } from "../static/src/types/home"

	defineProps({
		current: {
			type: Number,
			default: 0
		}
	})
	const emit = defineEmits<{
		(e : 'update', value : number) : void
	}>()

	const list = ref<bottomTabbar[]>([
		{
			iconPath: "/static/src/tabbar/home_icon.png",
			selectedIconPath: "/static/src/tabbar/home_active_icon.png",
			text: '首页',
			customIcon: false
		},
		{
			iconPath: "/static/src/tabbar/my_icon.png",
			selectedIconPath: "/static/src/tabbar/my_active_icon.png",
			text: '我的',
			customIcon: false
		},
	])
	
	const handleChange =(num:number)=>{
		emit('update', num);
	}
	
</script>

<style lang="scss" scoped>
</style>